<template>
    <view class="page-container">
      <!-- 搜索区域 -->
      <view class="search-bar">
        <view class="search-container">
          <uni-search-bar v-model="searchName" placeholder="输入店铺名称" radius="100" clearButton="auto" @confirm="handleSearch" />
          <view class="action-buttons">
            <view class="search-btn" @click="handleSearch">搜索</view>
            <uni-icons class="add-btn" type="plus" size="30" @click="handleCreateStore" />
          </view>
        </view>
      </view>
  
      <!-- 列表区域 -->
      <view class="list-container">
        <view v-if="stores.length">
          <view v-for="(store, index) in stores" :key="index" class="store-card">
            <view class="hearder-box">
              <view class="store-img">
                <image class="store-image" :src="store.image_url || '/static/card4.png'" mode="aspectFill" />
              </view>
              <view class="store-title">
                <text class="store-name">{{ store.name }}</text>
                <text class="status-text" :class="!store.is_deleted ? 'open' : 'closed'">
                  {{ store.is_deleted ? '(已停业)' : '营业中' }}
                </text>
              </view>
              <view class="store-time-status" v-if="store.open_time && store.close_time">
                <text class="store-time">🕒 {{ Util.formatTime(store.open_time) }}-{{ Util.formatTime(store.close_time) }}</text>
              </view>
            </view>
  
            <view class="store-actions">
              <view class="primary-action" @click.stop="handleViewStore(store.store_id)">订单管理</view>
              <view class="action-links">
                <text class="action-link" @click.stop="goToAddConsumption(store.store_id)">新增收支</text>
                <text class="action-link" @click.stop="toStatistics(store)">业绩提成</text>
                <text class="action-link" @click.stop="handleCardManagement(store)">卡包管理</text>
              </view>
            </view>
          </view>
        </view>
        <view v-else class="store-card flex-center">
          <text>暂无店铺信息</text>
        </view>
      </view>
  
      <tab-bar />
    </view>
  </template>

<script>
export default {
    props: {
        limit: {
            type: Number,
            default: 5
        },
        url: {
            type: String,
            required: true
        }
    },
    data() {
        return {
            searchText: '',
            currentPage: 1,
            totalPages: 5,
            listData: []
        }
    },
    created() {
        this.generateMockData()
    },
    methods: {
        formatTime(time) {
            return time.slice(0, 5); // 简单格式化时间
        },
        goToOrder(storeId) {
            uni.navigateTo({
                url: `/pages/store/detail?id=${storeId}`
            });
        },
        goToStatistics(store) {
            uni.navigateTo({
                url: `/pages/store/statistics?store_id=${store.store_id}&store_name=${encodeURIComponent(store.name)}`
            });
        },
        goToConsumption(storeId) {
            uni.navigateTo({
                url: `/pages/store/add_consumption?store_id=${storeId}`
            });
        },
        goToCardPackage(store) {
            uni.navigateTo({
                url: `/pages/card_package/index?store_id=${store.store_id}&manager_id=${store.manager_id}`
            });
        },
        generateMockData() {
            // 更新模拟数据
            const mockData = []
            for (let i = 0; i < this.limit; i++) {
                mockData.push({
                    store_id: `store_${i}`,
                    name: `店铺 ${(this.currentPage - 1) * this.limit + i + 1}`,
                    is_deleted: Math.random() > 0.8,
                    open_time: '09:00:00',
                    close_time: '21:00:00',
                    manager_id: `manager_${i}`
                })
            }
            this.listData = mockData
        }
    },
    handleSearch() {
        // 模拟搜索请求
        this.currentPage = 1
        this.generateMockData()
    },
    handleAdd() {
        uni.showToast({
            title: '点击了新增',
            icon: 'none'
        })
    },
    prevPage() {
        if (this.currentPage > 1) {
            this.currentPage--
            this.generateMockData()
        }
    },
    nextPage() {
        if (this.currentPage < this.totalPages) {
            this.currentPage++
            this.generateMockData()
        }
    },
    generateMockData() {
        // 生成模拟数据
        const mockData = []
        for (let i = 0; i < this.limit; i++) {
            mockData.push({
                title: `项目 ${(this.currentPage - 1) * this.limit + i + 1}`,
                content: `这是第${this.currentPage}页的第${i + 1}条数据`
            })
        }
        this.listData = mockData
    }
}
</script>

<style lang="scss">
@import '@/uni.scss';

</style>